<!DOCTYPE html>
<html>
<head>
    <meta charset="gbk">
    <title>月度计划表明细</title>
    <meta name="renderer" content="webkit">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <link href="/general/erp5/public/step-lay/css/layui.css" rel="stylesheet"/>
    <link href="/general/erp5/public/step-lay/step.css" rel="stylesheet">
    <link rel="stylesheet" href="/general/erp5/public/step-lay/css/default.css?t=1586046995308" media="all">
</head>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body" style="padding-top: 40px;">
            <div class="layui-carousel" id="stepForm" lay-filter="stepForm" style="margin: 0 auto;">
                <div carousel-item>
                    <div>
                        <form class="layui-form" style="margin: 0 auto;max-width: 460px;padding-top: 40px;">
                            <div class="layui-form-item">
                                <label class="layui-form-label">填报部门</label>
                                <div class="layui-input-block">
                                    <input type="text" name="department" placeholder="请填写填报部门" class="layui-input"
                                           value="{$detail['0']['department']}" required/>
                                </div>
                            </div>
                            <div class="layui-form-item">
                                <label class="layui-form-label">填报人:</label>
                                <div class="layui-input-block">
                                    <input type="text" name="user_name" placeholder="请填写填报人" class="layui-input"
                                           value="{$detail['0']['creator']}" required>
                                </div>
                            </div>
                            <input type="hidden" name="id" id="plan_id" value="{$detail['0']['id']}">
                            <div class="layui-form-item">
                                <div class="layui-input-block">
                                    <button class="layui-btn" lay-submit lay-filter="formStep">
                                        &nbsp;下一步&nbsp;
                                    </button>
                                </div>
                            </div>
                        </form>
                    </div>
                    <div>
                        <table id="item_list" lay-filter="item_list"><input type="hidden" name="Plan_Num" id="Plan_Num"
                                                                            value="{$detail['0']['plan_num']}"></table>
                        <div class="layui-form-item">
                            <div class="layui-input-block">
                                <button class="layui-btn" lay-submit lay-filter="formStep2">
                                    &nbsp;下一步&nbsp;
                                </button>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div style="text-align: center;margin-top: 90px;">
                            <i class="layui-icon layui-circle"
                               style="color: white;font-size:30px;font-weight:bold;background: #52C41A;padding: 20px;line-height: 80px;">&#xe605;</i>
                            <div style="font-size: 24px;color: #333;font-weight: 500;margin-top: 30px;">
                                添加成功
                            </div>
                            <div style="font-size: 14px;color: #666;margin-top: 20px;" id="planmum"></div>
                        </div>
                        <div style="text-align: center;margin-top: 50px;">
                            <button class="layui-btn next">继续添加</button>
                            <button class="layui-btn layui-btn-primary">查看出差明细</button>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/html" id="additem">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn-sm" lay-event="additem">添加出差明细</a>
    </div>
</script>
<script type="text/html" id="item_list_c">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn-xs" lay-event="edititem">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del_item_list">删除</a>
    </div>
</script>
<script src="/general/erp5/public/step-lay/layui.js"></script>
<script src="/general/erp5/public/step-lay/step.js"></script>
<script>
    function getQueryString(name) {
        var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
        var r = window.location.search.substr(1).match(reg);
        if (r != null) {
            return unescape(r[2]);
        }
        return null;
    }

    layui.config({
        base: '/general/erp5/public/step-lay/'
    });

    layui.use(['form', 'step', 'table'], function () {
        var $ = layui.$
            , form = layui.form
            , step = layui.step
            , table = layui.table
            , utils = layui.utils;

        step.render({
            elem: '#stepForm',
            filter: 'stepForm',
            width: '100%', //设置容器宽度
            stepWidth: '750px',
            height: '900px',
            stepItems: [{
                title: '基本信息'
            }, {
                title: '申请明细'
            }, {
                title: '确认完成'
            }]
        });

        //头工具栏事件
        table.on('toolbar(item_list)', function (obj) {
            switch (obj.event) {
                case 'additem':
                    var planid = $("#plan_id").val();
                    selectRole(planid);
                    break;
            }
        })
        //头工具栏事件
        table.on('tool(item_list)', function (obj) {
            switch (obj.event) {
                case 'edititem':
                    //var planid = $("#plan_id").val();
                    eidtRole(obj.data.id);
                    break;
            }
        })

        function selectRole(planid) {
            layer.open({
                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                type: 2,
                title: "添加明细",
                area: ['100%', '100%'],
                content: "/general/erp5/public/travel/travelplan/additem?planid=" + planid,
                success: function () {
                    form.render();
                },
                end: function () {
                    table.reload('testReload');
                }
            });
        }

        function eidtRole(planid) {
            layer.open({
                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                type: 2,
                title: "添加明细",
                area: ['100%', '100%'],
                content: "/general/erp5/public/travel/travelplan/edititem?id=" + planid,
                success: function () {
                    form.render();
                },
                end: function () {
                    table.reload('testReload');
                }
            });
        }

        form.on('submit(formStep)', function (data) {
            var id = $("#plan_id").val();
            $.ajax({
                url: "/general/erp5/public/travel/travelplan/update",
                type: "POST",
                data: data.field,
                dataType: "json",
                success: function (data) {
                    step.next('#stepForm');
                    table.render({
                        elem: '#item_list'
                        , url: '/general/erp5/public/travel/travelplan/GetListByAjaxitem?nid=' + id
                        , request: {
                            page: 'page',   // 页码的参数名称，默认：page
                            limit: 'limit'   // 每页数据量的参数名，默认：limit
                        }
                        , response: {
                            statusName: 'status'
                            , statusCode: 200
                            , msgName: 'msg'
                            , countName: 'count'
                            , dataName: 'data'
                        }
                        , cols: [[
                            {checkbox: true, fixed: true}
                            , {field: 'id', title: 'ID', fixed: 'left', width: 70, align: 'center', totalRowText: '合计'}
                            , {field: 'plan_num', title: '计划单号', width: 150, align: 'center'}
                            , {field: 'department1', title: '一级部门', width: 150, align: 'center'}
                            , {field: 'traveler', title: '申报人', width: 150, align: 'center'}
                            , {field: 'start_time', title: '开始日期', width: 150, align: 'center'}
                            , {field: 'end_time', title: '结束日期', width: 150, align: 'center'}
                            , {field: 'customer_name', title: '客户名称', width: 150, align: 'center'}
                            , {field: 'trip_address', title: '出差地', width: 150, align: 'center'}
                            , {field: 'reason', title: '出差事由', width: 350, align: 'center'}
                            , {field: 'remark', title: '出差备注', width: 250, align: 'center'}
                            , {field: 'traffic_money', title: '交通费', width: 150, align: 'center', totalRow: true}
                            , {field: 'hotel_money', title: '住宿费', width: 150, align: 'center', totalRow: true}
                            , {field: 'meal_money', title: '餐费', width: 150, align: 'center', totalRow: true}
                            , {field: 'total_money', title: '合计', width: 150, align: 'center', totalRow: true}
                            , {
                                field: '',
                                title: '操作',
                                width: 280,
                                fixed: 'right',
                                align: 'center',
                                toolbar: '#item_list_c'
                            }
                        ]]
                        , id: 'testReload'
                        , page: true
                        , totalRow: true
                        , limit: 10
                        , toolbar: "#additem"
                        , text: {none: '暂无相关数据'}
                    })

                }
            });
            return false;
        });

        form.on('submit(formStep2)', function (data) {
            var plan_num = $("#Plan_Num").val();
            $("#planmum").text("月度出差单号:     " + plan_num);
            var traffic_money = $(".layui-table-total .laytable-cell-1-0-11").text();
            var hotel_money = $(".layui-table-total .laytable-cell-1-0-12").text();
            var meal_money = $(".layui-table-total .laytable-cell-1-0-13").text();
            var total_money = $(".layui-table-total .laytable-cell-1-0-14").text();
            var params = [traffic_money,hotel_money,meal_money,total_money];
            $.ajax({
                url: "/general/erp5/public/travel/travelplan/SaveToUpdate?plan_num=" + plan_num,
                type: "POST",
                data: 'params='+params,
                dataType: "json",
                success: function (data) {
                    if(data.status == "200"){
                        $.get("http://localhost/general/erp5/public/common.php?params=" + data.data.params, function (result) {

                        });
                    }
                }
            })
            // step.next('#stepForm');
            return false;
        });

        $('.pre').click(function () {
            step.pre('#stepForm');
        });

        $('.next').click(function () {
            step.next('#stepForm');
        });
    })
</script>
</body>
</html>
